/* 头部 begin */
.Zhu_header {
    background-color: #000;
    opacity: 0.7;
    /*position: fixed;*/
}
.zhu_header .navbar-brand {
    color: red;
    font: 700 20px/20px '微软雅黑';
}
.zhu_header .navbar-text {
    color: #777;
}
.zhu_header .navbar-nav > li {
    margin-left: 20px;
}
.zhu_header .navbar-nav > li > a {
    color: #fff;
    font: 18px '微软雅黑';
}
.zhu_header .navbar-nav > li > a:hover,
.zhu_header .navbar-nav > li > a:focus {
    color: #2288f6;
    background-color: #000;
    opacity: 0.7;
}
.zhu_header .navbar-toggle {
    border-color: #ddd;
}
.zhu_header .navbar-toggle:hover,
.zhu_header .navbar-toggle:focus {
    background-color: #ddd;
}
.zhu_header .navbar-toggle .icon-bar {
    background-color: #888;
}
@media (max-width: 767px) {
    .zhu_header .navbar-nav .open .dropdown-menu > li > a {
        color: #777;
    }
    .zhu_header .navbar-nav .open .dropdown-menu > li > a:hover,
    .zhu_header .navbar-nav .open .dropdown-menu > li > a:focus {
        color: #333;
        background-color: transparent;
    }
    .zhu_header .navbar-nav .open .dropdown-menu > .active > a,
    .zhu_header .navbar-nav .open .dropdown-menu > .active > a:hover,
    .zhu_header .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #555;
        background-color: #e7e7e7;
    }
    .zhu_header .navbar-nav .open .dropdown-menu > .disabled > a,
    .zhu_header .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .zhu_header .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #ccc;
        background-color: transparent;
    }
}
.zhu_header .navbar-link {
    color: #777;
}
.zhu_header .navbar-link:hover {
    color: #333;
}
.zhu_header .btn-link {
    color: #777;
}
.zhu_header .btn-link:hover,
.zhu_header .btn-link:focus {
    color: #333;
}
.zhu_header .btn-link[disabled]:hover,
fieldset[disabled] .zhu_header .btn-link:hover,
.zhu_header .btn-link[disabled]:focus,
fieldset[disabled] .zhu_header .btn-link:focus {
    color: #ccc;
}
/* 头部 end */

/* 固定栏 begin */
.fixed {
    position: fixed;
    top: 10%;
    right: 0%;
    text-align: center;
    z-index: 1;
    display: none;
}
.fixed a {
    display:block;
    text-decoration: none;
    position: relative;
    right: -90px;
    height: 30px;
    margin-top: 1%;
}
.fixed a i {
    display: inline-block;
    font: 700 20px/30px '微软雅黑';
    width: 30px;
    height: 30px;
    border-radius: 5px;
    color: #fff;
    float: left;
}
.fixed a span {
    display: inline-block;
    font: 15px/30px '微软雅黑';
    float: left;
    width: 90px;
}
/* 固定栏 end */

/* 图片部分 begin */
html, body {
    width: 100%;
    height: 100%;
}
/*移动端*/
.m_img{
    width: 100%;
    position: relative;
}
.m_img img{
    width: 100%;
    display: block;
}
.m_img .record_2 {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -50px;
}
.m_img .record_2 .img_3 {
    width: 100px;
}
.m_img .record_2 .img_4 {
    width: 50px;
    position: absolute;
    top: 25px;
    left: 25px;
    border-radius: 50%;
}
.m_img .record_2 .img_3 {
     -ms-animation: img_3 6s linear infinite;     /* IE 9 */
     -moz-animation: img_3 6s linear infinite;    /* Firefox */
     -webkit-animation: img_3 6s linear infinite; /* Safari 和 Chrome */
     -o-animation: img_3 6s linear infinite;      /* Opera */
     animation: img_3 6s linear infinite;
 }
    /*非移动端*/
.pc_img{
    width: 100%;
    display: block;
    height: 120%;
    background-size: cover ;
    background-position: center;
    position: relative;
}
.pc_img .img_2 {
    position: absolute;
    top: 60px;
    left: 60px;
    width: 170px;
    border-radius: 50%;
}
.pc_img .record {
    position: absolute;
    top: 30px;
    left: 50%;
    margin-left: -146px;
}
.pc_img .record .img_1 {
    -ms-animation: img_3 6s linear infinite;    /* IE 9 */
    -moz-animation: img_3 6s linear infinite;   /* Firefox */
    -webkit-animation: img_3 6s linear infinite;/* Safari 和 Chrome */
    -o-animation: img_3 6s linear infinite;     /* Opera */
    animation: img_3 6s linear infinite;
}
/* 图片部分 end */

/* 基本信息 begin */
.Zhu_message {
    text-align: left;
    padding-left: 5%;
    padding-right: 5%;
    background-color: #F5F5F5;
    display: none;
    position: relative;
}
.Zhu_message .message {
    padding: 5% 0;
}
.Zhu_message .line {
    width: 100%;
    height: 1px;
    background-color: #D3D3D3;
}
.Zhu_message .message h3 {
    font: 700 20px/20px '微软雅黑';
    color: red;
    text-align: center;
}
.Zhu_message .message .message_c {
    margin-top: 5%;
}
.Zhu_message .message p {
    font: 18px/40px '微软雅黑';
}
.Zhu_message .message p span {
    font-weight: 700;
}
/* 基本信息 end */
/* 技能作品 begin */
.Zhu_skill {
    padding: 5%;
    background-color: #2C3E50;
}
.Zhu_skill .Zhu_skill_t {
    text-align: center;
}
.Zhu_skill .Zhu_skill_t h3 {
    font: 700 25px/25px '微软雅黑';
    color: red;
}
.Zhu_skill .Zhu_skill_t ul li {
    margin-top: 6%;
}
.Zhu_skill .Zhu_skill_t ul li a {
    display: inline-block;
    width: 120px;
    height: 50px;
    text-align: center;
    font: 700 18px/50px '微软雅黑';
    text-decoration: none;
    position: relative;
}
.Zhu_skill .Zhu_skill_t ul li a i {
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    background-color: red;
    opacity: 0.5;
    border-radius: 50%;
    -webkit-animation: skill 4s linear infinite alternate;
}
.Zhu_skill .Zhu_skill_t ul li a s {
    position: absolute;
    top: 0;
    left: 108px;
    width: 10px;
    height: 10px;
    background-color: #000;
    opacity: 0.5;
    border-radius: 50%;
    -webkit-animation: skill-2 4s linear infinite alternate;
}

.Zhu_skill_2 {
    background-color: #fff;
    padding: 5% 0;
    text-align: center;
}
.Zhu_skill_2 .Zhu_skill_b h3 {
    font: 700 25px/25px '微软雅黑';
    color: red;
    margin-top: 4%;
}
.Zhu_skill_2 .Zhu_skill_b ul li {
    margin-top: 10%;
}
.Zhu_skill_2 .Zhu_skill_b ul li a {
    display: block;
    width: 300px;
    height: 260px;
    background-size: 100% 100%;
    margin: 0 auto;
}
.Zhu_skill_2 .Zhu_skill_b ul li .a_1 {
    background: url("../images/111.JPG") no-repeat;
    background-size: 100% 100%;
    opacity: 0.5;
}
.Zhu_skill_2 .Zhu_skill_b ul li .a_2 {
    background: url("../images/013.JPG") no-repeat;
    background-size: 100% 100%;
    opacity: 0.5;
}
.Zhu_skill_2 .Zhu_skill_b ul li .a_3 {
    background: url("../images/136.JPG") no-repeat;
    background-size: 100% 100%;
    opacity: 0.5;
}
.Zhu_skill_2 .Zhu_skill_b ul li .a_4 {
    background: url("../images/090.JPG") no-repeat;
    background-size: 100% 100%;
    opacity: 0.5;
}
/* 技能作品 end */

/* 特效展示 begin */
/*移动端*/
.effects_m_img{
    width: 100%;
    /*height: 100%;*/
    position: relative;
    overflow: hidden;
    text-align: center;
}
.effects_m_img img{
    width: 100%;
    display: block;
}.effects_m_img .txtMarquee {
    position: absolute;
    top: 0;
    width: 100%;
 }
.effects_m_img .txtMarquee-top{
    overflow:hidden;
    position:relative;
}
.effects_m_img .txtMarquee-top ul li {
    width: 100%;
    height:70px;
}
.effects_m_img .txtMarquee-top ul li a {
    display: block;
    width: 100%;
    font: 700 16px/70px '微软雅黑';
    color: #fff;
    text-decoration: none;
}
.effects_m_img .txtMarquee-top ul li:hover a {
    color: red;
}
/*非移动端*/
.effects_pc_img {
    display: block;
    width: 100%;
    height: 100%;
    background-size: cover ;
    background-position: center;
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 5% 0 0;
}
.effects_pc_img ul li {
    width: 100%;
}
.effects_pc_img ul li a {
    display: inline-block;
    width: 33%;
    height: 100px;
    font: 700 18px/100px '微软雅黑';
    text-decoration: none;
    color: #fff;
}
.effects_pc_img ul li a:hover {
    color: red;
}
/* 特效展示 end */
/* 尾部 begin */
.footer {
    text-align: center;
}
.footer .container-fluid {
    background-color: #2F2F2F;
    padding: 5% 0;
}
.footer .container-fluid .relation {
    margin-top: 3%;
}
.footer .container-fluid .relation h3 {
    color: red;
    font: 700 20px/300% '微软雅黑';
}
.footer .container-fluid .relation .email {
    margin-top: 3%;
}
.footer .container-fluid .relation .email p {
    font: 16px/200% '微软雅黑';
    color: #fff;
}
.footer .container-fluid .relation .email .p_1 {
    color: #6EB92B;
    font-weight: 700;
}
.footer .container-fluid .relation .phone {
    margin-top: 5%;
}
.footer .container-fluid .relation .phone p {
    font: 16px/200% '微软雅黑';
    color: #fff;
}
.footer .container-fluid .relation .phone .p_1 {
    color: #6EB92B;
    font-weight: 700;
}
.footer .container-fluid .relation img {
    width: 170px;
    height: 170px;
}
.footer .container-fluid .code {
    margin-top: 3%;
}
.footer .container-fluid .code h3 {
    color: red;
    font: 700 20px/300% '微软雅黑';
}
.footer .container-fluid .code .weixin {
    margin-top: 3%;
}
.footer .container-fluid .code .weixin p {
    font: 700 16px/300% '微软雅黑';
    color: #6EB92B;
}
.footer .container-fluid .code .QQ {
    margin-top: 3%;
}
.footer .container-fluid .code .QQ p {
    font: 700 16px/300% '微软雅黑';
    color: #6EB92B;
}
.footer .container-fluid .code img {
    width: 170px;
    height: 170px;
}
.footer .designed {
    background-color: #000;
    color: #fff;
    font: 700 20px/300% '微软雅黑';
}
/* 尾部 end */